<template>
	<el-dialog :title="titleMap[mode]" v-model="visible" :width="600" destroy-on-close @closed="$emit('closed')">
		<el-form :model="form" :rules="rules" :disabled="mode=='show'" ref="dialogForm" label-width="120px" label-position="left">
			<el-form-item label="会员ID" prop="member_id">
				<el-input v-model="form.member_id" clearable placeholder="请输入会员ID"></el-input>
			</el-form-item>
			<el-form-item label="充值金额" prop="amount">
				<el-input-number v-model="form.amount" controls-position="right" :min="0.01" :precision="2" style="width: 100%"></el-input-number>
			</el-form-item>
			<el-form-item label="赠送金额" prop="give">
				<el-input-number v-model="form.give" controls-position="right" :min="0" :precision="2" style="width: 100%"></el-input-number>
			</el-form-item>
			<el-form-item label="支付方式" prop="pay_type">
				<el-select v-model="form.pay_type" filterable style="width: 100%" placeholder="请选择支付方式" :disabled="mode=='add'">
					<el-option v-for="(item, key) in payTypes" :key="key" :label="item" :value="key"/>
				</el-select>
			</el-form-item>
			<el-form-item label="状态" prop="status">
				<el-select v-model="form.status" filterable style="width: 100%" placeholder="请选择状态" :disabled="mode=='add'">
					<el-option v-for="(item, key) in statuss" :key="key" :label="item" :value="key"/>
				</el-select>
			</el-form-item>
			<el-form-item label="第三方单号" prop="tordernum">
				<el-input v-model="form.tordernum" clearable placeholder="请输入第三方单号（可选）"></el-input>
			</el-form-item>
		</el-form>
		<template #footer>
			<el-button @click="visible=false" >取 消</el-button>
			<el-button v-if="mode!='show'" type="primary" :loading="isSaveing" @click="submit()">保 存</el-button>
		</template>
	</el-dialog>
</template>

<script>
	export default {
		emits: ['success', 'closed'],
		data() {
			return {
				mode: "add",
				titleMap: {
					add: '新增充值订单',
					edit: '编辑充值订单',
					show: '查看充值订单'
				},
				visible: false,
				isSaveing: false,
				payTypes: {
					'1': '支付宝',
					'2': '微信',
					'3': '银联',
					'4': '抖音',
					'5': '对公转账'
				},
				statuss: {
					'0': '待审核',
					'1': '支付成功',
					'2': '支付失败',
					'3': '已取消'
				},
				//表单数据
				form: {
					member_id: '',
					amount: 0.01,
					give: 0,
					pay_type: '5',
					status: '0',
					tordernum: ''
				},
				//验证规则
				rules: {
					member_id: [
						{required: true, message: '请输入会员ID', trigger: 'blur'}
					],
					amount: [
						{required: true, message: '请输入充值金额', trigger: 'blur'}
					],
					pay_type: [
						{required: true, message: '请选择支付方式', trigger: 'change'}
					],
					status: [
						{required: true, message: '请选择状态', trigger: 'change'}
					]
				}
			}
		},
		mounted() {

		},
		methods: {
			//显示
			open(mode='add'){
				this.mode = mode;
				this.visible = true;
				return this
			},
			//表单提交方法
			submit(){
				this.$refs.dialogForm.validate(async (valid) => {
					if (valid) {
						this.isSaveing = true;
						var res
						let form = JSON.parse(JSON.stringify(this.form))
						if (this.form.id) {
							res = await this.$API.rechargeOrder.update.post(form);
						}  else {
							res = await this.$API.rechargeOrder.create.post(form);
						}

						this.isSaveing = false;
						if(res.code == 200){
							this.$emit('success', this.form, this.mode)
							this.visible = false;
							this.$message.success("操作成功")
						}else{
							this.$alert(res.msg, "提示", {type: 'error'})
						}
					}
				})
			},
			//表单注入数据
			setData(data){
				this.form.id = data.id
				this.form.member_id = data.member_id
				this.form.amount = parseFloat(data.amount)
				this.form.give = parseFloat(data.give)
				this.form.pay_type = data.pay_type || '5'
				this.form.status = data.status || '0'
				this.form.tordernum = data.tordernum || ''
			}
		}
	}
</script>

<style>
</style>
